<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>awesome</title>
</head>
<body>

<div id="box">box</div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.js"></script>
<script>
  /*返回的是函数的执行结果*/
  let a =foo()
  /*
  * 返回的是函数本身*/
  let b =foo

  /*下面这个写法和上面是一样的 DOM事件的回调函数一般是像下面这样写 返回的是一个函数而不是执行结果*/
  let c = function(){

  }

  /*
  * 原生和JQ中事件回调函数中的this都是DOM元素本身 在React中获得DOM本身要使用refs
  *
  * */
  document.getElementById("box").onclick = handleClick

    function handleClick(e){
        console.log(this);
      console.log();

    }

  $("#box").click(function(){
    console.log(this);
  })

  function foo() {

  }

  /*
  * 如果map中的回调函数是定义好的那我们可以这样调用
  * */
  let res1 = [1,2,3,4,5].map(increase)
  console.log(res1);

  let res2 = [1,2,3,4,5].map(num => increase(num))
  console.log(res2);

  function increase(a){
    return a+1
  }
</script>
</body>
</html>